Skip to main content

Setting Your Project's Local Environment to Connect to Supabase

You now need to set your project ABAIR_APP_X to point to your local version of Supabase. This will be done through use of environment variables.

Create Environment Variables for Development

In the root directory of your project, create a file .env.development

In this file, copy the necessary URLs and keys generated by the Supabase CLI when you started the instance, e.g:

ABAIR_APP_X/.env.development

SUPABASE_URL=https://127.0.0.1:54321
SUPABASE_ANON_KEY=eyJhbGciOiJI.....

Note: there is different port for the Supabase API than Supabase Studio.

Install dotenv

Install dotenv, a Node.js module used for loading environment variables from a .env file into process.env.

npm install dotenv

Edit scripts in package.json to include NODE_ENV

In your package.json, include export NODE_ENV=development; in scripts->dev, e.g:

"scripts": {
"dev": "export NODE_ENV=development;...",
...

Create Supabase Client

Whenever you create a Supabase client, you will use dotenv to supply the appropriate environment variables, e.g.

import { createClient } from "@supabase/supabase-js";
import { config as dotenvConfig } from "dotenv";

dotenvConfig({ path: `.env.${process.env.NODE_ENV}` });

export const supabase = createClient(
process.env.SUPABASE_URL,
process.env.SUPABASE_ANON_KEY,
);